<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>普通管理员表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="./lib/layui/css/layui.css"  media="all">
    <script src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script src="./js/jquery.min.js"></script>
</head>
<body>

<form class="layui-form layui-col-space5">
    <div class="layui-inline layui-show-xs-block">
        <input type="text" name="tel" id="tel" placeholder="请输入用户名" autocomplete="off" class="layui-input">
    </div>
    <div class="layui-inline layui-show-xs-block">
        <input type="text" name="sname" id="sname" placeholder="请输入电话" autocomplete="off" class="layui-input">
    </div>
    <div class="layui-inline layui-show-xs-block">
        <button class="layui-btn" lay-submit="" lay-filter="sreach">
            <i class="layui-icon">&#xe615;</i></button>
    </div>
</form>
<table class="layui-hide" id="biao" lay-filter="biao"></table>
</body>
<script>
    layui.use(['table', 'form','layer'],function(){
        var table = layui.table;
        var form=layui.form;
        var layer=layui.layer;
        table.render({
            elem: '#biao'
            ,url:'Search.ao'
            ,limits: [10,20,30]
            ,limit: 10
            ,cols: [[
                {field:'id', width:120, title: 'ID', sort: true}
                ,{field:'username', width:120, title: '用户名'}
                ,{field:'role', width:120, title: '职位',templet: '#role'}
                ,{field:'tele', title: '电话'}
            ]]
            ,page: true
        });
        form.on('submit(sreach)',function(data){
            table.reload("biao", {
                page : {
                    curr : 1
                },
                where : data.field
            });
            return false;
        });
        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    })
</script>
   <script type="text/html" id="role">
                  {{#  if(d.role === 1){ }}
                     <span class="layui-badge layui-bg-green">超级管理员</span>
                  {{#  } else { }}
                   <span class="layui-badge">管理员</span>
                  {{#  } }}
            </script>
</html>